import './App.css'

import { BrowserRouter as Router, NavLink } from "react-router-dom"

// 导入路由相关模块
import routes from './router/index'
import RouterView from './router/RouterView'

function App() {

  return (
    <div className="App">
      <div>
        <h2>入口视图模块</h2>

        <Router>
          {/* 添加声明式导航: 类似vue router-link */}
          <nav>
            <NavLink to="/main">首页</NavLink>
            <NavLink to="/login">登录</NavLink>
            <NavLink to="/reg">注册</NavLink>
          </nav>

          {/* 添加路由视图: 类似vue <router-view> */}
          <div className="content">
            <RouterView routes={routes}></RouterView>
          </div>
        </Router>

      </div>
    </div>
  )
}

export default App
